<template>
    <InsertWin @close="close" win-width="40%" closeSize="1.6" inHeight="500px">
        <p class="title">
            添加用户
        </p>
        <div class="contain">
            <li>
                姓名: <input type="text" v-model="info.name">
            </li>
            <li>
                学校: <input type="text" v-model="info.school">
            </li>
            <li>
                学院: <input type="text" v-model="info.college">
            </li>
            <li>
                专业: <input type="text" v-model="info.major">
            </li>
            <li v-show="type != 2">
                班级: <input type="text" v-model="info.grades">
            </li>
            <li>
                工号: <input type="text" v-model="info.number">
            </li>
        </div>
        <div class="but">
            <button @click="close">取消</button>
            <button id="yes" @click="submitChange">确定</button>
        </div>
    </InsertWin>
</template>
<script setup>
import { ref, getCurrentInstance } from 'vue';
import { getUserData } from '../utils';
import InsertWin from './PopUpWindow.vue'

const http = getCurrentInstance()?.appContext.config.globalProperties.$http


// 获得用户信息
// 获得用户信息
let userData = {
    Token: '',
    avatar: '',
    id: '',
    role: ''
}
if (getUserData() != undefined) {
    userData = getUserData();
}

const props = defineProps({
    type: Number
})

// 添加成员类型
const type =  props.type

const info = ref({
    name: '',
    school: '',
    college: '',
    major: '',
    grades: '',
    number: ''
})
const emits = defineEmits(['close'])

const close = function () {
    emits('close')
}
info.value.type = type

const submitChange = function () {
    info.value.type = type
    let params = JSON.stringify(
        info.value
    )
    fetch(http + '/admin/subUser', {
        method: 'post',
        headers: {
            "Token": userData.Token,
            'Content-Type': 'application/json; charset=utf-8'
        },
        body: params,
        responseType: 'json',
    }).then((response) => {
        return response.json()
    }).then((data) => {
        console.log(data);
        if (data.code == 200) {
            emits('succHandle')
            history.go(0)
        } else {
            emits('errHandle', data.msg)
        }
        emits('close')
    }).catch((err) => {
        console.log(err);
    })
}

</script>
<style scoped>
.title {
    font-family: Source Han Sans CN;
    font-size: 22px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 20px;
    letter-spacing: 0px;
    color: #707070;
    text-align: center;
    margin-top: 5%;
    font-weight: 550;
}
.contain {
    width: 100%;
    display: flex;
    margin-top: 4%;
    height: 65%;
    justify-content: space-between;
    flex-direction: column;
    display: flex;
    padding-left: 24%;
}


.contain li {
    font-family: Source Han Sans CN;
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 20px;
    letter-spacing: 0px;
    list-style: none;
    color: #707070;
    outline: none;
}

.contain input {
    padding-left: 4%;
    padding-right: 10%;
    background: url('../assets/images/administrator/edit.svg') 95% center no-repeat;
    width: 251px;
    height: 34px;
    background-color: #f1f2f6;
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
    border-radius: 6px;
    margin-left: 2%;
    outline: none;
    border: 0px;
    color: #707070;
}

.but {
    margin-top: 3.4%;
    width: 100%;
    padding-left: 15%;
    padding-right: 15%;
    display: flex;
    justify-content: space-between;
}

.but button {
    width: 160px;
    height: 40px;
    cursor: pointer;
    background-color: #707070;
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
    opacity: 0.75;
    color: white;
    border: 0px;
    font-family: Source Han Sans CN;
    font-size: 17px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 34px;
    letter-spacing: 0px;
    color: #fafafa;
    border-radius: 6px;
}

#yes {
    background-color: #8493a6 !important;
}
</style>